<template>
  <div class="home">
    <el-select v-model="value" @change="onChange">
      <el-option label="中文" value="zh"></el-option>
      <el-option label="英文" value="en"></el-option>
    </el-select>
    <h1>{{ $t('message.home') }}</h1>
    <h1> {{ $t('message.hello') }} </h1>
    <BaseTable></BaseTable>
  </div>
</template>

<script>
import { mapActions } from 'vuex'
import BaseTable from '@/components/BaseTable'
export default {
  components: { BaseTable },
  data() {
    return {
      value: '中文'
    }
  },
  methods: {
    ...mapActions('language', [
      'updateLang'
    ]),
    auto() {
      console.log('1')
    },
    onChange(v) {
      const label = v === 'zh' ? '中文' : '英文';
      this.updateLang({ label, value: v })
      window.location.reload()
    }
  }
}
</script>

<style>
</style>
